<ul id="navContent">
    <!-- <li><a href="#">首页</a></li>
    <li><a href="#">坚果手机</a></li>
    <li><a href="#">TNT</a></li>
    <li><a href="#">官方自营</a></li>
    <li><a href="#">服饰箱包</a></li>
    <li><a href="#">抖音热销</a></li>
    <li><a href="#">数码3C</a></li>
    <li><a href="#">家居生活</a></li>
    <li><a href="#">家用电器</a></li>
    <li><a href="#">美妆个护</a></li>
    <li><a href="#">服务</a></li> -->
</ul>
<!-- 使用模板引擎渲染导航栏文字 -->
<script type="text/html" id="navTemplate">
    {{each list item}}
    <li class="{{item.type}}">
        <a href="{{item.id?'/html/list.html?categeory&categeory_id='+item.id:'/'}}">{{item.name}}</a>
    </li>
    {{/each}}
    <li>
        <!-- 滚动时添加class="scrollhide" -->
        <div>
            <button>
                <span class="iconfont icon-sousuo"></span>
            </button>
            <input type="text" class="searchbar" />

            <!-- 搜索框搜索时移除class="tiphidden" -->
            <span class="iconfont icon-cha1 tiphidden"></span>

            <!-- 搜索框搜索时加上class="tiphidden" -->
            <p class="tip1">坚果R2</p>
            <p class="tip2">TNT</p>
        </div>
        <b class="iconfont icon-ziyuan"></b>
        <b class="iconfont icon-gouwu"></b>
    </li>
</script>
<!-- 渲染二级菜单 -->
<div class="navSub">
    <!-- <div class="category">
        <h2>手机</h2>
        <div>
            <img src="https://resource.smartisan.com/resource/a4c73e549097c7f5cf2c5e0d87e56d13.png" />
            <span>手机</span>
        </div>
    </div> -->
    <!-- 数据使用模板引擎渲染 -->
    <!-- 第一种样式class="category" -->
</div>
<script type="text/html" id="subNavCategoryTemplate">
    {{each subList item}}
    <div class="category">
        <h2>{{item.title}}</h2>
        {{each item.sub item1}}
        <div>
            <img src="{{item1.image}}" />
            <span>{{item1.name}}</span>
        </div>
        {{/each}}
    </div>
    {{/each}}
</script>
<!-- 使用模板引擎渲染二级导航 -->
<!-- 第二种样式class="goods" -->
<script type="text/html" id="subNavGoodsContent">
    <div class="goods">
        <ul>
            {{each subList item}}
            <li>
                <img src="{{item.ali_image}}" />
                <h2>{{item.sku_name}}2</h2>
                <span><em>&yen;{{item.sell_price}}</em>起</span>
            </li>
            {{/each}}
        </ul>
    </div>
</script>